<template>
  <div id="container">
    <section id="main">	
      <h1 class="headLine01">掲示物一覧</h1>
      <div class="comBox">
        <div class="mailForm">
          <ul class="formList">

			<div v-show="!bulletinBoardlist.length">
                <li>掲示物データありません</li>
			</div>
			<div v-show="bulletinBoardlist.length">
                <li v-for="(detail, idx) in bulletinBoardlist" :key="idx" @click="goDetail(idx)">
                    {{detail.bulletinTitle}}
                </li>
			</div>
          </ul>
        </div>
      </div>
    </section>
  </div>

</template>

<script>
export default {
	data() {
		return {
            bulletinBoardlist:[]
		}
	},

	created() {
        this.getInitData();
    },
    
    methods: {
        getInitData() {
            this.Api.get('bulletinBoard').then(res => {
                if (res.data.data) {
                    this.bulletinBoardlist = res.data.data;
                }
            }).catch(err => {
            });
        },

        goDetail(idx) {
            let detaildata = this.bulletinBoardlist[idx];
            // console.log(detaildata.bulletinId);
            let query = {
                bulletinId: detaildata.bulletinId
            };
            this.$router.push({
                path: '/customer/bulletinBoardDetail',
                query: query
            });

        }
  }

}
</script>
